<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>内容页</title>
		<link rel="stylesheet" type="text/css" href="./Public/Home/css/index.css"/>
		<link rel="stylesheet" type="text/css" href="./Public/Home/css/content.css"/>
		<script src="Public/jquery-1.8.2.min.js" type="text/javascript" charset="utf-8"></script>
		<script>
			$(function () {
				$('.desk-one').click(function(){

					$(this).addClass('abcd').siblings().removeClass('abcd');
					//li标签的个数，也就是有多少属性
					var liLen=$('.two-quarter').length;
					//选中的元素个数
					var redLen=$('.abcd').length;
					if (redLen==liLen){
						var str='';
						//得到所有选中的商品属性ID，然后发异步
						$.each($('.radio-label'),function () {
							str +=$(this).attr('specId')+ ',';
						})

					}
				})
			})
		</script>
		<script>
			$(function(){
				$('.button-left').click(function(){
				var name=$('.product-title').html();
                var gid=$(this).attr('gid');
//                console.log(gid);
                var price=$('.price').text();
                var oldPrice=$('.old-price').text();
//                    console.log(price);
                var num=$('.number').val();
					var type=[];
					$.each($('.module'),function (k,v){
						var gname=$(this).find('.radio-label').text();
						var gvalue=$(this).find('.abcd').text();
						type.push(gname+':'+gvalue);
					})
					$.ajax({
						type:"post",
						url:"<?php echo U('Cart/add')?>",
						data:{id:gid,name:name,num:num,price:price,oldPrice:oldPrice,options:type},
						dataType:"text",
						success:function (phpData) {
//                            location.href = ;
						}
					})
//                    return false;
				})
			})
		</script>
	</head>
	<body>

		<!--头部条开始-->
				
	<!--头部条开始-->
	<div id="header">
		<div class="center">
			<!--左部分开始-->
			<ul class="left">
				<li class="gi1">
					<a href="javascript:;">社区</a>
				</li>
				<li class="gi2">
					<a href="javascript:;">ColorOS</a>
				</li>
				<li class="gi3">
					<a href="javascript:;">软件商店</a>
				</li>
				<li class="gi4">
					<a href="javascript:;">手机助手</a>
				</li>
				<li class="gi5">
					<a href="javascript:;">云服务</a>
				</li>
			</ul>
			<!--左部分结束-->
			
			<!--右部分开始-->
			<ul class="right">
				<li class="gi1">
                                            <a href="http://localhost/opposhop/index.php?m=Home&c=Login&a=index">登录</a>
                    
               				</li>
				<li class="gi2">
                    					<a href="http://localhost/opposhop/index.php?m=Home&c=Login&a=zhuce">注册</a>
                    
               				</li>
				
			</ul>
		</div>
	</div>
	<!--头部条结束-->
	
	<!--导航区域开始-->
	<div id="dh">
		<div id="wrapper">
		<div id="logo">
			<img src="./Public/Home/images/oppo_logo.png"/>
		</div>
		<div class="shop">

			<span class="text"><a href="http://localhost/opposhop/index.php?m=Home&c=Cart&a=index">购物车</a></span>
			<span class="icon"></span>
			<span class="num"> 
				<span class="shop-count">
					0
				</span>
			</span>
		</div>
		<ul class="nav">
				<li class="gi1">
					<a href="index.php"  >首页</a>
				</li>
							<li class="gi2" >
					<a href="http://localhost/opposhop/index.php?m=Home&c=List&a=index&cid=1" >手机</a>
				</li>
				</div>
	</div>

	<!--导航区域结束-->
	
	<!--内容部分开始-->
	<?php foreach ($data as $v){?>

				<div id="main-content">
			<ul class="breadcrumb">

			</ul>
			<div class="buying-details">
				<div class="left-photo">
					<img src="<?php echo $v['smallpic']?>" style="width: 588px;height: 665px;"/>
					<div class="owl-stage">
						<div class="ps-carousel">
							<div class="active">
								<img src="<?php echo $v['smallpic']?>" style="width: 77px;height: 77px;border-radius: 50%;"/>
							</div>
						</div>
					</div>
				</div>
				<div class="">

				</div>
					<div class="right-details">
					<div class="buying-header-desk">
						<h1 class="product-title">
							<?php echo $v['gname']?>
						</h1>
						<p class="product-name-extra">
							<?php echo $v['intro']?>
						</p>
					</div>
					<div class="buying-price">
							<p>
								￥<strong class="price"><?php echo $v['shopprice']?></strong>
								<?php if($v['marketprice']!=0){?>
                
								￥<span class="old-price"><?php echo $v['marketprice']?></span>
								
               <?php }?>
							</p>
					</div>
					<div class="add-cart">
						<form class="add-cart-form" action="<?php echo U('Cart/index')?>" method="post">
							<?php foreach ($goodsAttrData as $v){?>
								<div class="module">
								<div class="one-quarter">
									<div class="radio-label" specId="<?php echo $v['gaid']?>">
										<?php echo $v['taname']?>
									</div>
								</div>
								<div class="two-quarter">
									<?php foreach ($v['value'] as $value){?>
											<div class="desk-one">
											<a href="javascript:;">
												<?php echo $value?>
											</a>
										</div>
									<?php }?>
								</div>
							</div>
							<?php }?>
							<div class="buying-action">
								<script>
									$(function(){
										$('.minus').click(function () {
											var num=parseInt($(".number").val())||0;
											num=num-1;
											num=num<1?1:num;
											$(".number").val(num);
										})
										$('.plus').click(function () {
											var num=parseInt($(".number").val())||0;
											$(".number").val(num+1);
										})
									})
								</script>
								<div class="lap-one">
									<div class="wrapper">
										<div class="counter-box">
											<a  href="javascript:;" class="minus" >-</a>
											<input type="text" value="1" class="number" />
											<a href="javascript:;" class="plus">+</a>
										</div>
									</div>
								</div>

								<div class="lap-two">
									<div class="one-half">
										<button class="button-left" gid="<?php echo $_GET['gid']?>"><a href="<?php echo U('Cart/index')?>">加入购物车</a></button>
									</div>
									<div class="two-half">
										<button class="button-right" gid="<?php echo $_GET['gid']?>"><a href="<?php echo U('Cart/index')?>">立即购买</a></button>
									</div>

								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
		<?php }?>

		<!--内容部分结束-->
				<div class="product-view">
			<div class="product-view-tabs">
				<ul class="wrapper">
					<li class="product">
						<a href="javascript:;">商品详情</a>
					</li>
					<li class="norms">
						<a href="javascript:;">规格参数</a>
					</li>
				</ul>
			</div>
			<div class="product-detail-tab">
				<?php foreach ($detailData as $v){?>
					<p class="photo1">
							<img src="<?php echo $v?>" style="border: 0;vertical-align: middle;height: auto;"/>
					</p>
				<?php }?>
			</div>
		</div>







		 	<!--公共底部-->
	<div id="foot-pic">
		<div id="gi">
			<span id="img">
			</span>
			<span id="text">
				OPPO社区
			</span>
		</div>
		
		<div id="gi1">
			<span id="img">
			</span>
			<span id="text">
				ColorOS
			</span>
		</div>
		
		<div id="gi2">
			<span id="img">
			</span>
			<span id="text">
				软件商店
			</span>
		</div>		
	</div>
	
	<div id="sitemap">
		<div class="wrapper">
			<div id="gi">
				<ul class="gi1">
					<span class="h_write">
						推荐机型
					</span>
					<ul class="gi2">
													<li><a href="http://localhost/opposhop/index.php?m=Home&c=Goods&a=index&gid=16">R9Plus金 大屏续航旗舰</a></li>
													<li><a href="http://localhost/opposhop/index.php?m=Home&c=Goods&a=index&gid=21">R9金 1600W前置自拍</a></li>
													<li><a href="http://localhost/opposhop/index.php?m=Home&c=Goods&a=index&gid=18"> A37玫瑰金 美颜4.0</a></li>
													<li><a href="http://localhost/opposhop/index.php?m=Home&c=Goods&a=index&gid=19">A59 闪速正面指纹识别</a></li>
											</ul>
				</ul>		
			</div>
			
			<div id="gi">
				<ul class="gi1">
					<span class="h_write">
						在线购买
					</span>

					<ul class="gi2">
											<li><a href="http://localhost/opposhop/index.php?m=Home&c=List&a=index&cid=1">手机</a></li>
										</ul>
				</ul>		
			</div>
			
			<div id="gi">
				<ul class="gi1">
					<span class="h_write">
						会员中心
					</span>
					<ul class="gi2">
						<li><a href="http://localhost/opposhop/index.php?m=Home&c=Login&a=index">会员登录</a></li>
						<li><a href="http://localhost/opposhop/index.php?m=Home&c=Login&a=zhuce">会员注册</a></li>
					</ul>
				</ul>		
			</div>		
		</div>
	</div>
	
	<div id="footer-tools">
		<div class="wrapper">
			<div class="h-wrapper">
				<span class="text">关注我们</span>
				<span class="icon">
					<img src="./Public/Home/images/weibo.png" style="width: 43px;height: 42px;"/>
				</span>
				<span class="icon1">
					<img src="./Public/Home/images/weixin.png" style="width: 43px;height: 42px;"/>
					<img class="img100" src="./Public/Home/images/erweima.png"/>										
				</span>
					<span class="text1">加入我们</span>
					<span class="text1">采购相关</span>				
			</div>
			
			<div class="h-subscribe">
				<span class="icon">
					<img src="./Public/Home/images/kefu.png"/>
				</span>
				<div class="about">
					<h4 class="h-delta">在线客服</h4>
					<p class="write">人工服务：8:30~22:00</p>
					<p class="write">24小时智能机器人服务</p>
					
				</div>	
				
				<span class="icon">
					<img src="./Public/Home/images/phone.png"/>
				</span>
				<div class="about">
					<h4 class="h-delta">4001-666-888</h4>
					<p class="write">7*24小时客服电话</p>
				</div>	
			</div>	
		</div>
	</div>
	<div id="bottom">
		<div class="center">
			<p class="bottom-info">© 2005 - 2016 东莞市永盛通信科技有限公司 | 版权所有 粤ICP备14056724号-2 | 联系方式：4001-666-888</p>
		</div>
	</div>
	</body>
</html>
